<template>
  <div>
    <div class="top"></div>
    <van-grid :border="false" :column-num="3">
      <van-grid-item icon="new-arrival-o" text="我的作品"></van-grid-item>
      <van-grid-item icon="star-o" text="我的收藏"></van-grid-item>
      <van-grid-item icon="clock-o" text="阅读历史"></van-grid-item>
    </van-grid>
    <van-cell-group>
      <van-cell icon="edit" title="编辑资料" @click="$router.push('/user/profile')" is-link/>
      <van-cell icon="chat-o" title="小明同学" @click="$router.push('/user/chat')" is-link />
      <van-cell icon="setting-o" title="系统设置" is-link />
      <van-cell icon="warning-o" title="退出登录"  @click="logout" is-link/>
    </van-cell-group>
  </div>
</template>

<script>
import { mapMutations } from 'vuex'
export default {
  methods: {
    logout () {
      this.delUser()
      this.$router.push('/login')
      this.$toast({
        type: 'success',
        message: '成功退出'
      })
    },
    ...mapMutations(['delUser'])
  }
}
</script>

<style  scoped lang="less">
.top {
  background-color: rgb(77, 152, 236);
  width: 100%;
  height: 150px;
}
</style>
